// 导航守卫 页面访问权限
// 需求：只有登录后才能访问系统中页面（除了登录和404页面之外）
// 我们只需要判断token是否存在即可，当token存在则已登录，否则未登录
import router from './router'
import store from './store'

router.beforeEach(async (to, from, next) => {
  // 访问模块中变量的语法：store.state.模块名.变量名
  //   console.log('token',store.state.user.token);
  // console.log('userInfo',store.state.user.userInfo);
  if (store.state.user.token) {
    // 已登录
    // 需求：当系统已经是登录状态了，那么不需要跳转到登录，如果访问的是登录页页面重新跳转到首页即可
    if (to.path === '/login/' || to.path === '/login') {
      next('/')
    } else {
      if (!store.state.user.userInfo.id) {
        await store.dispatch('user/getUserInfo')
      }
      /** 用户权限，动态路由 */
      if (!store.state.user.userPermission.page) {
        // console.log(123);
        let routes = await store.dispatch('user/getUserPermission')
        routes.forEach(item => {
          router.addRoute(item)
        })
        next(to.path)// 放行函数
      } else {
        next()
      }
    }
  } else {
    // 未登录 跳转到登录页面
    // 当访问的页面本来就是登录页面或者404页面的时候需要直接放行
    const writerArr = ['/login', '/404', '/register'] // 白名单，所有在白名单内的页面都可以直接访问
    // if (to.path === '/login' || to.path === '/404') { //这种方式做判断，不可与拓展
    // 只需要判断到我们访问的目标路由路径，存在在白名单数组中即可说明还页面时可以直接访问的
    // includes方法 查找数组中是否存在某个元素，存在则返回true否则返回false
    if (writerArr.includes(to.path)) {
      next()
    } else {
      // 执行这行代码的时候会不会重新触发导航守卫？
      // 答：会，因为next方法传入路径是跳转，不是放行
      next('/login')
    }
  }
})
